<template>
    <div class="box_alarm">
        <MoodalTitle :title="'案件情况'" />
        <div class="flex">
            <div class="box_le">
                <p class="box_p">{{form.todayOrders}} <span style="font-size: 1.4rem;">件</span></p>
                <p>今日上报数</p>
            </div>
            <div class="box_le">
                <p class="box_p">{{form.todayClosed}} <span style="font-size: 1.4rem;">件</span></p>
                <p>今日结案数</p>
            </div>
            <div class="box_le">
                <p class="box_p">{{form.completionRate}} <span style="font-size: 1.4rem;">%</span></p>
                <p>办结率</p>
            </div>
        </div>
        <div class="box_flex">
            <div class="box_pla">
                <img class="img_t" src="../../../../assets/images/zhangzi/analysis/la.png" alt="">
                <p class="box_p1">已立案</p>
                <p class="box_p2">{{ form.putOnRecordSum || 0 }}</p>
            </div>
            <div class="box_jt">
                <img class="img_i" src="../../../../assets/images/zhangzi/analysis/jiantou_xiangyou.png" alt="">
            </div>

            <div class="box_pla">
                <img class="img_t" src="../../../../assets/images/zhangzi/analysis/ypq.png" alt="">
                <p class="box_p1">已派遣</p>
                <p class="box_p2">{{ form.dispatchSum || 0 }}</p>
            </div>
            <div class="box_jt">
                <img class="img_i" src="../../../../assets/images/zhangzi/analysis/jiantou_xiangyou.png" alt="">
            </div>

            <div class="box_pla">
                <img class="img_t" src="../../../../assets/images/zhangzi/analysis/clz.png" alt="">
                <p class="box_p1">已处理</p>
                <p class="box_p2">{{ form.disposeSum  || 0 }}</p>
            </div>
            <!-- <div class="box_jt">
                <img class="img_i" src="../../../../assets/images/zhangzi/analysis/jiantou_xiangyou.png" alt="">
            </div> -->

            <!-- <div class="box_pla">
                <img class="img_t" src="../../../../assets/images/zhangzi/analysis/ysh.png" alt="">
                <p class="box_p1">已审核</p>
                <p class="box_p2">{{ form.auditSum || 0 }}</p>
            </div>
            <div class="box_jt">
                <img class="img_i" src="../../../../assets/images/zhangzi/analysis/jiantou_xiangyou.png" alt="">
            </div>

            <div class="box_pla">
                <img class="img_t" src="../../../../assets/images/zhangzi/analysis/ja.png" alt="">
                <p class="box_p1">已结案</p>
                <p class="box_p2">{{ form.closedSum || 0 }}</p>
            </div> -->
        </div>
    </div>
</template>
<script>
import MoodalTitle from '@/components/ModalTitle/Index.vue'
import { ZhShianalysis } from '@/api/zhangzi/index'
export default {
    components: { MoodalTitle },
    data() {
        return {
            form:{}
        }
    },
    mounted() { 
        this.getZhangzi()
    },
    methods: {
        //案件情况
        getZhangzi() {
            ZhShianalysis.casesAPI().then(res =>{
                console.log(res,'案件情况');
                if(res.code == 200){
                    this.form = res.data
                }
            })
        }
    }
}
</script>

<style lang="less" scoped>
.box_alarm {
    width: 60.7rem;
    height: 38.5rem !important;
    margin-bottom: 1.9rem;
}

.flex {
    display: flex;
    justify-content: space-between;
}

.box_le {
    margin-top: 3rem;
    width: 14.3rem;
    height: 8.1rem;
    text-align: center;
    color: #fff;
    font-size: 1.4rem;
    background: url(../../../../assets/images/zhangzi/Special/Escalation.png)no-repeat;

    // background-size: cover;
    .box_p {
        margin: 0.8rem 0 0.3rem 0;
        font-size: 2.8rem !important;
        color: #219EFF;
    }
}

.box_pla {
    text-align: center;
}

.box_flex {
    width: 100%;
    margin-top: 3rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.box_p1 {
    margin: 0.5rem 0 0.5rem 0;
    font-size: 1.4rem;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: #FFFFFF;
}

.box_p2 {
    font-size: 2rem;
    font-family: PingFangSC-Semibold, PingFang SC;
    font-weight: 600;
    color: #00C3FC;
}

.box_jt {
    margin-bottom: 5.5rem;
    margin-left: 1rem;
    margin-right: 1rem;
}

.img_t {
    width: 5rem;
}

.img_i {
    width: 3rem;
}</style>